<template>
    <div class="header-body g-flex-center" :style="{ 'background-image': 'url('+this.bgurl+')'}">
    </div>
</template>

<script>
    export default {
        name:'HeaderComponent',

        data(){
            return {
                bgurl:require('@/assets/images/bg.png')
            }
        }
    }
</script>

<style scoped>
    .g-flex-center{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .header-body {
        height: 150px;
        background-color: #faf7cc;
    }
    .g-flex{
        display: flex;
    }

    .logo {
        margin-right: 30px;
        width: 60px;
        font-size: 0;
    }

    .text {
        text-align: center;
        white-space: pre-line;
        color: rgba(228, 57, 60, 1);
        font-size: 50px;
        font-family: 'Arial-bold';
        line-height: 1.2em;
    }
</style>
